<template>
  <div class="box">
    <h3 class="title">{{detailInfo.title}}</h3>
    <van-row type="flex" justify="space-between">
      <van-col>发表时间: {{detailInfo.add_time | dateFormat}}</van-col>
      <van-col>点击次数: {{detailInfo.click}}</van-col>
    </van-row>
    <div v-html="detailInfo.content" class="article_content"></div>

    <my-comment></my-comment>
  </div>
</template>
<script>
import Comment from "../../components/Comment.vue";
export default {
  data() {
    return {
      detailInfo: {}
    };
  },

  created() {
    this.getDetail();
  },
  methods: {
    async getDetail() {
      const newId = location.hash.split("/")[3];
      const { data: res } = await this.$http.get("/api/getnew/" + newId);
      this.detailInfo = res.message[0];
    }
  },
  components: {
    "my-comment": Comment
  },
};
</script>
<style lang="less" scoped>
.van-row {
  margin: 0 10px;
  padding: 7px 0;
  border-bottom: 1px solid #ccc;
}
.title {
  text-align: center;
  color: #1989fa;
  font-size: 14px;
  height: 40px;
  line-height: 40px;
  margin: 0;
}
.van-col {
  font-size: 13px;
  color: #1989fa;
}
.article_content {
  margin: 0 10px;
  color: #535353;
  font-size: 14px;
  line-height: 26px;
}

.box {
  padding: 0 10px;
}
</style>